<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="{{ url_for('static',filename='layui/css/layui.css') }}" rel="stylesheet"/>
    <script type="text/javascript" src="{{ url_for('static',filename='jquery/jquery-3.5.1.min.js') }}"></script>
    <script type="text/javascript">
        function loginForAjax() {
            // alert($("#f2").serialize())
            uname = $("#l_uname").val();
            if (uname.length == 0) {
                layer.msg("nuname can not null")
                return
            }
            upwd = $("#l_upwd").val();
            if (upwd.length == 0) {
                layer.msg("upwd can not null")
                return
            }
            if (upwd.length <6) {
                layer.msg("upwd can not lt 6")
                return
            }
            $.ajax({
                url:'/login',
                data:$("#f2").serialize(),
                method: "post",
                success:function (result){
                    if(result==1)
                    layer.msg("login success", {
                            time: 2000,
                            icon: 1
                        }, function () {
                            window.location.href = "/manager"
                        });
                    else
                        layer.msg("login fault", {
                            time: 3000,
                            icon: 2
                        });
                },
                error:function (e){
                     layer.msg("request server error")
                }
            });

        }

        function registerForAjax() {
            {#alert($("#f1").serialize())#}
            $.ajax({
                url: "register",
                method: "post",
                data: $("#f1").serialize(),
                success: function (result) {
                    if (result == "1")
                        layer.msg("register success", {
                            time: 5000,
                            icon: 1
                        }, function () {
                            window.location.href = "/"
                        });

                    else
                        alert("fault")
                },
                error: function (e) {
                    alert("conn error")
                }

            });
        }
    </script>
</head>
<body style="background-color:#F0F0F0">
<br><br><br>
<center>
    <div style="width: 40%;">
        <img src="{{ url_for('static',filename='images/img.png') }}" style="height: 200px;width: 100%">
        <div class="layui-card">
            <div class="layui-card-header" align="center">
                <h2 class="bg-success">个人博客后台管理系统</h2>
            </div>
            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">Login</li>
                    <li>Register</li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <fieldset class="layui-elem-field">
                            <legend>Person Login Page</legend>
                        </fieldset>
                        <form action="#" method="post" id="f2" name="f2" class="layui-form">
                            <div class="layui-form-item">
                                <label class="layui-form-label">Uname</label>
                                <div class="layui-input-block" style="margin-right: 20px">
                                    <input  id="l_uname" name="l_uname" class="layui-input"
                                           placeholder="please input a uname">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">Upwd</label>
                                <div class="layui-input-block" style="margin-right: 20px">
                                    <input type="password" id="l_upwd" name="l_upwd" class="layui-input"
                                           placeholder="please input a upwd">
                                </div>
                            </div>
                            <div class="layui-form-item" align="center">
                                <a href="javascript:loginForAjax()" class="layui-btn"><span
                                        class="layui-icon layui-icon-user"></span> Login</a>
                                <a href="javascript:f2.reset()" class="layui-btn layui-btn-warm"><span
                                        class="layui-icon layui-icon-fonts-clear"></span> Reset</a>
                            </div>
                        </form>
                    </div>
                    <div class="layui-tab-item ">
                        <fieldset class="layui-elem-field">
                            <legend>Person Register Page</legend>
                        </fieldset>
                        <form method="post" id="f1" name="f1" class="layui-form">
                            <div class="layui-form-item">
                                <label class="layui-form-label">Uname</label>
                                <div class="layui-input-block">
                                    <input id="uname" name="uname" class="layui-input"
                                           placeholder="please input a uname">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">Upwd</label>
                                <div class="layui-input-block">
                                    <input type="password" id="upwd" name="upwd" class="layui-input" placeholder="please input a upwd">
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">Cupwd</label>
                                <div class="layui-input-block">
                                    <input type="password" id="cupwd" name="cupwd" class="layui-input"
                                           placeholder="please input a Cupwd">
                                </div>
                            </div>
                            <div class="layui-form-item" align="center">
                                <a href="javascript:registerForAjax()" class="layui-btn"><span
                                        class="layui-icon layui-icon-user"></span> Register</a>
                                <a href="javascript:f1.reset()" class="layui-btn layui-btn-warm"><span
                                        class="layui-icon layui-icon-fonts-clear"></span> Reset</a>
                            </div>
                        </form>
                    </div>

                </div>
            </div>
        </div>
    </div>
</center>
<script type="text/javascript" src="{{ url_for('static',filename='layui/layui.js') }}"></script>
</body>
</html>